<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery鼠标点击手风琴展开特效 - 站长素材</title>

<link href="css/style.css" type="text/css"  rel="stylesheet" />

<script type="text/javascript" src="js/jquery.min.js"></script>

</head>
<body>
<!--手风琴效果-->
<div class="flash4">
	<ul>
    	<li class="first">
        	<div class="imgTop"><img src="images/ruili_img1.jpg" width="538" height="405"  alt="" class="tm"/></div>
            <div class="imgCen">给你15分钟做“对”的时尚人</div>
            <div class="imgBot"><a href=""><p class="bt_1">服饰</p><p class="bt_2"><span>封面明星故事</span><span>2015春夏趋势</span><span>我爱海淘</span></p></a></div>
        </li>
        <li>
        	<div class="imgTop"><img src="images/ruili_img2.jpg" width="538" height="405"  alt=""/></div>
            <div class="imgCen">蒂芙尼为你吟唱一曲自然颂</div>
            <div class="imgBot"><a href=""><p class="bt_1">服饰</p><p class="bt_2"><span>封面明星故事</span><span>2015春夏趋势</span><span>我爱海淘</span></p></a></div>
        </li>
        <li>
        	<div class="imgTop"><img src="images/ruili_img3.jpg" width="538" height="405"  alt=""/></div>
            <div class="imgCen">瑞丽·妆 线上精品轻杂志</div>
            <div class="imgBot"><a href=""><p class="bt_1">服饰</p><p class="bt_2"><span>封面明星故事</span><span>2015春夏趋势</span><span>我爱海淘</span></p></a></div>
        </li>
        <li>
        	<div class="imgTop"><img src="images/ruili_img4.jpg" width="538" height="405"  alt=""/></div>
            <div class="imgCen">《ar》刘海造型 女孩只需这样即刻焕然一新</div>
            <div class="imgBot"><a href=""><p class="bt_1">服饰</p><p class="bt_2"><span>封面明星故事</span><span>2015春夏趋势</span><span>我爱海淘</span></p></a></div>
        </li>
        <li>
        	<div class="imgTop"><img src="images/ruili_img5.jpg" width="538" height="405"  alt=""/></div>
            <div class="imgCen">电影×大明星 见证传奇从戛纳诞生</div>
            <div class="imgBot"><a href=""><p class="bt_1">服饰</p><p class="bt_2"><span>封面明星故事</span><span>2015春夏趋势</span><span>我爱海淘</span></p></a></div>
        </li>
        <li>
        	<div class="imgTop"><img src="images/ruili_img6.jpg" width="538" height="405"  alt=""/></div>
            <div class="imgCen">重返20岁试用周</div>
            <div class="imgBot"><a href=""><p class="bt_1">服饰</p><p class="bt_2"><span>封面明星故事</span><span>2015春夏趋势</span><span>我爱海淘</span></p></a></div>
        </li>
        <li class="fast">
        	<div class="imgTop"><img src="images/ruili_img7.jpg" width="538" height="405"  alt=""/></div>
            <div class="imgCen">玩美女孩盖天天 阳光女神进阶攻略</div>
            <div class="imgBot"><a href=""><p class="bt_1">服饰</p><p class="bt_2"><span>封面明星故事</span><span>2015春夏趋势</span><span>我爱海淘</span></p></a></div>
        </li>
    </ul>	
</div>
<!--手风琴结束-->


<script src="js/script.js" type="text/javascript"></script>

<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器：IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗.</p>
<p>来源：<a href="http://sc.chinaz.com/" target="_blank">站长素材</a></p>
</div>
</body>
</html>